body {
width: 221px; 
height: 369px;
font-family: Trebuchet MS;
position: relative;
}


textarea {
resize: none;
}

#locationTabs ul {
list-style: none;
margin: 0;
padding: 0;
}

#locationTabs li {
float: left;
margin: 0;
padding: 0;
width: 33.3%;
text-align: center;
background: #e570e7; /* Old browsers */
background: -moz-linear-gradient(top, #e570e7 0%, #c85ec7 47%, #a849a3 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e570e7), color-stop(47%,#c85ec7), color-stop(100%,#a849a3)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #e570e7 0%,#c85ec7 47%,#a849a3 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #e570e7 0%,#c85ec7 47%,#a849a3 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #e570e7 0%,#c85ec7 47%,#a849a3 100%); /* IE10+ */
background: linear-gradient(to bottom, #e570e7 0%,#c85ec7 47%,#a849a3 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e570e7', endColorstr='#a849a3',GradientType=0 ); /* IE6-9 */

margin-bottom: 5px;
}

#locationTabs img {
    width: 30px;
	padding: 2px;
	margin-top: 3px;
}

#locationTabs a {
    font-family: "Trebuchet MS", sans-serif;
    display: block;
    color: #000;
    text-decoration: none;
    padding: 0 2px 0 2px;
    line-height: 15px;
    border: none;
}

#locationTabs a.current {
    margin-top: 0px;
    height: 15px;
    color: #aaa;
    line-height: 15px;
}

/* BUTTONS */.buttons a, .buttons button{
    display:block;
    float:left;
    margin:0 0px 0 0;
    background-color:#f5f5f5;
    border:1px solid #dedede;
    border-top:1px solid #eee;
    border-left:1px solid #eee;    
    font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
    font-size:60%;
    line-height:170%;
    text-decoration:none;
    
    color:#565656;
    cursor:pointer;
    padding:0px 0px 0px 0px; /* Links padding:5px 10px 6px 7px;*/
}
.buttons button{
    width:auto;
    overflow:visible;
    padding:0px 0px 0px 0px; /* IE6 padding:4px 10px 3px 7px;*/
}
.buttons button[type]{
    padding:1px 10px 0px 10px; /* Firefox padding:5px 10px 5px 7px;*/
     /* Safari line-height:17px; */
}
*:first-child+html button[type]{
    padding:0px 0px 0px 0px; /* IE7 padding:4px 10px 3px 7px;*/
}

.buttons {
	position: absolute;
	bottom: 0;
}

.buttons div img {
	margin: 15%;
width: 70%;
margin-top: 5px;
margin-bottom: 0px;
}

.buttons div {
	display: inline-block;
	width: 23%;
}

#secondaryControls, #noteBox, .buttons {
background-color: #F0F0EB;
}

#secondaryControls div img {
	width: 40%;
	margin: 0;
}

#noteArea {
	height: 100%;
	width: 97%;
}

#secondaryControls div {
	text-align: center;
	display: inline-block;
	width: 31%;
}

form {
height: 96%;
}

#noteBox {
	position: absolute;
	bottom: 46px;
	left: 0;
	right: 0;
	top: 74px;
}

@media only screen and (max-width: 480px) {  
  html, body {
        border: none;
		width: 100%; 
		height: 100%;
        margin: 0;
		text-align: center;
		overflow: hidden;
	}
	
	#noteBox {
		top: 90px;
		bottom: 64px;
	}

	#locationTabs {
		text-align: center;
	}

	.buttons {
		width: 100%;
		text-align: center;
	}
}	